<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh-CN" lang="zh-CN">
    <head>
        <meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
        <title>jweiqi - 会下围棋的JavaScript程序</title>
        <style type="text/css">
            html, body
            {
                margin:0;
                padding:0;
            }
            body, button, input, select
            {
                font-family:微软雅黑,黑体,Arial;
                font-size:16px;
            }
            .boardGrid
            {
                border-collapse:collapse;
                margin:0;
                padding:0;
            }
            .boardGrid td
            {
                margin:0;
                padding:0;
            }
            .boardGrid td, .boardGridBorder
            {
                border:1px solid rgb(0,0,64);
            }
            .button
            {
                position:relative;
                float:left;
                width:50px;
                height:50px;
                cursor:pointer;
            }
            .buttonBackground
            {
                position:absolute;
                left:0;
                top:0;
                width:100%;
                height:100%;
            }
            .textIcon
            {
                font-size:28px;
                color:rgb(255,255,255);
                text-align:center;
                line-height:50px;
                position:absolute;
                left:0;
                top:0;
                width:100%;
                height:100%;
            }
            .shadow
            {
                position:absolute;
                left:0;
                top:0;
            }
            #content.bigLayout
            {
                width:1100px;
                height:600px;
            }
            #content.smallLayout
            {
                width:950px;
                height:450px;
            }
        </style>
        <script type="text/javascript" src="jquery-1.6.1.min.js"></script>
        <script type="text/javascript" src="main.js" charset="utf-8"></script>
        <script type="text/javascript">

            var _gaq = _gaq || [];
            _gaq.push(['_setAccount', 'UA-19880790-2']);
            _gaq.push(['_trackPageview']);

            (function () {
                var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
                ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
                var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
            })();

        </script>
    </head>
    <body style="background-color:rgb(224,224,224);">
        <div id="content" class="bigLayout" style="margin:0 auto;">
            <div style="float:left;width:250px;height:200px;">
                <div id="leftVisual" style="position:relative;width:150px;height:150px;float:left;">
                    <img class="shadow" src="shadow150.png" alt="" />
                    <div style="background-color:rgb(192,192,192);position:absolute;left:0;top:0;width:150px;height:150px;">
                        <div class="button" onmousedown="JWEIQI.initBySize(5);"><div class="buttonBackground" style="background-color:rgb(0,0,255);"></div><div class="textIcon">5</div></div>
                        <div class="button" onmousedown="JWEIQI.initBySize(6);"><div class="buttonBackground" style="background-color:rgb(255,0,0);"></div><div class="textIcon">6</div></div>
                        <div class="button" onmousedown="JWEIQI.initBySize(7);"><div class="buttonBackground" style="background-color:rgb(160,255,0);"></div><div class="textIcon">7</div></div>
                        <div class="button" onmousedown="JWEIQI.initBySize(8);"><div class="buttonBackground" style="background-color:rgb(128,0,0);"></div><div class="textIcon">8</div></div>
                        <div class="button" onmousedown="JWEIQI.initBySize(9);"><div class="buttonBackground" style="background-color:rgb(255,192,0);"></div><div class="textIcon">9</div></div>
                        <div class="button" onmousedown="JWEIQI.initBySize(11);"><div class="buttonBackground" style="background-color:rgb(0,0,128);"></div><div class="textIcon">11</div></div>
                        <div class="button" onmousedown="JWEIQI.initBySize(13);"><div class="buttonBackground" style="background-color:rgb(0,128,0);"></div><div class="textIcon">13</div></div>
                        <div class="button" onmousedown="JWEIQI.initBySize(15);"><div class="buttonBackground" style="background-color:rgb(128,128,128);"></div><div class="textIcon">15</div></div>
                        <div class="button" onmousedown="JWEIQI.initBySize(19);"><div class="buttonBackground" style="background-color:rgb(96,0,255);"></div><div class="textIcon">19</div></div>
                    </div>
                </div>
            </div>
            <div id="middleContent" class="bigLayout" style="float:left;position:relative;">
                <img id="boardShadow" class="shadow" src="shadow600.png" alt="" style="width:103.33%;height:103.33%;" />
                <img src="wood.jpg" alt="" style="position:absolute;left:0;top:0;width:100%;height:100%;" />
                <div id="boardContent" style="position:absolute;left:1%;right:1%;top:1%;bottom:1%;">
                    <div id="boardGridContainer" style="position:absolute;left:0;top:0;width:100%;height:100%;"></div>
                    <div id="boardStoneContainer" style="position:absolute;left:0;top:0;width:100%;height:100%;"></div>
                    <div id="boardLastMoveSymbol" style="position:absolute;width:0;height:0;border:1px solid rgb(255,0,0);"></div>
                    <div id="boardOverlay" style="position:absolute;left:0;top:0;width:100%;height:100%;background-color:rgb(128,128,128);cursor:crosshair;"></div>
                </div>
            </div>
            <div style="float:left;width:250px;height:200px;">
                <div id="rightVisual" style="position:relative;width:150px;height:150px;float:right;">
                    <img class="shadow" src="shadow150.png" alt="" />
                    <div style="background-color:rgb(192,192,192);position:absolute;left:0;top:0;width:150px;height:150px;">
                        <div class="button"><div class="buttonBackground" style="background-color:rgb(0,0,0);"></div><div class="textIcon">黑</div></div>
                        <div class="button"><div class="buttonBackground" style="background-color:rgb(192,192,192);"></div><div class="textIcon">白</div></div>
                        <div class="button"><div class="buttonBackground" style="background-color:rgb(128,128,128);"></div><div class="textIcon">无</div></div>
                        <div class="button"><div class="buttonBackground" style="background-color:rgb(160,255,0);"></div><div class="textIcon">始</div></div>
                        <div class="button"><div class="buttonBackground" style="background-color:rgb(255,0,0);"></div><div class="textIcon">弃</div></div>
                        <div class="button"><div class="buttonBackground" style="background-color:rgb(0,0,255);"></div><div class="textIcon">算</div></div>
                        <div class="button"><div class="buttonBackground" style="background-color:rgb(128,0,0);"></div><div class="textIcon">五</div></div>
                        <div class="button"><div class="buttonBackground" style="background-color:rgb(0,128,0);"></div><div class="textIcon">六</div></div>
                        <div class="button"><div class="buttonBackground" style="background-color:rgb(255,192,0);"></div><div class="textIcon">围</div></div>
                    </div>
                </div>
            </div>
        </div>
        <div style="display:none;"><!--这些图片都进行预加载，以在下第一手棋时不出现迟滞感-->
            <img src="black-stone-39.png" alt="" />
            <img src="black-stone-81.png" alt="" />
            <img src="black-stone-147.png" alt="" />
            <img src="white-stone-39.png" alt="" />
            <img src="white-stone-81.png" alt="" />
            <img src="white-stone-147.png" alt="" />
        </div>
    </body>
</html>